/* INIT 初始化页面样式 */
* {
	margin: 0;
	padding: 0;
	list-style: none;
}
a {
	text-decoration: none;
	color: #282828;
}
html, body {
	width: 100%;
	min-width: 76.875rem;
	overflow-x: hidden;
	scroll-behavior: smooth;
}
@font-face {
  font-family: 'iconfont';
  src: url('./font/iconfont.eot');
  src: url('./font/iconfont.eot?#iefix') format('embedded-opentype'),
      url('./font/iconfont.woff2') format('woff2'),
      url('./font/iconfont.woff') format('woff'),
      url('./font/iconfont.ttf') format('truetype'),
      url('./font/iconfont.svg#iconfont') format('svg');
}

/* END INIT */

/* MEDIA QUERY */
@media screen and (min-width: 1367px) {
	html, body {
		width: 1366px;
		font-size: 16px;
		margin: 0 auto;
		box-shadow: 0 0 .5rem 1rem #00000010;
	}
}

@media screen and (max-width:1270px) {
	header {
		padding-left: 2rem !important;
	}
}

/* END MEDIA QUERY */

/* HEADER 导航栏样式 */

.back-top {
	width: 3.125rem;
	height: 3.125rem;
	position: fixed;
	background-color: #00000050;
	border-radius: 4px;
	text-align: center;
	line-height: 3.125rem;
	bottom: 5rem;
	right: 2.5rem;
	z-index: 9999;
	color: #FFFFFF;
	cursor: pointer;
	display: none;
}

header {
	width: 100%;
	height: 3.5rem;
	font-size: 0.875rem;
	background-color: #FFE300;
	padding: 0 4.375rem;
	box-sizing: border-box;
	position: relative;
	z-index: 999;
}

.logo {
	height: 100%;
	padding-top: 1.125rem;
	box-sizing: border-box;
	float: left;
}
.logo img {
	width: 7.5rem;
	height: 1.25rem;
	float: left;
}

.nav {
	float: right;
}
.navbar {
	height: 100%;
	margin: 0 auto;
	float: left;
	text-align: center;
}
.navbar > ul {
	float: right;
	right: 0;
}
.navbar > ul > li {
	height: 3.5rem;
	padding: 0 1.5rem;
	float: left;
	line-height: 3.5rem;
	cursor: pointer;
}
.cheched {
	font-weight: 600;
}
.navbar > ul > li:hover {
	background-color: #282828;
}
.navbar > ul > li:hover > a {
	color: #FFE300;
}
.navbar > ul > li:last-child {
	width: 3.75rem;
	padding: 0 0 0 0.125rem;
	text-align: center;
	font-weight: 1000;
	letter-spacing: 0.125rem;
	line-height: 3.375rem;
	box-sizing: border-box;
}
.navbar > ul > li:last-child > div {
	text-align: left;
	font-weight: 400;
	letter-spacing: 0rem;
	margin-left: -0.125rem;
}
.navbar > ul > li > div {
	display: none;
}
.navbar > ul > li:nth-child(2):hover .discover {
	display: block;
}
.navbar > ul > li:nth-child(3):hover .job {
	display: block;
}
.navbar > ul > li:nth-child(4):hover .active {
	display: block;
}
.navbar > ul > li:nth-child(5):hover .material {
	display: block;
}
.navbar > ul > li:nth-child(6):hover .course {
	display: block;
}
.navbar > ul > li:nth-child(7):hover .copyright {
	display: block;
}
.navbar > ul > li:nth-child(8):hover .more {
	display: block;
}
.navbar > ul > li > .discover {
	width: 40.9375rem;
	height: 9rem;
	float: left;
	position: absolute;
	top: 3.5rem;
	border-radius: 0 0 0.25rem 0.25rem;
	margin-left: -1.5rem;
	box-shadow: 0 0.0625rem 0.75rem 0 rgba(0,0,0,.2);
	background-color: #FFFFFF;
}
.navbar > ul > li > .discover .discover-menu {
	width: 39.375rem;
	height: 4rem;
	border-bottom: 1px solid #eaeaea;
	padding: 0.6875rem 1.0625rem 1.0625rem;
}
.discover-menu > li {
	width: 5.625rem;
	height: 1.75rem;
	line-height: 1.75rem;
	text-align: center;
	margin-top: 0.25rem;
	position: relative;
}
.discover-menu > li::after {
	content: '';
	display: block;
	width: 0.0625rem;
	height: 0.9375rem;
	background-color: #DDDDDD;
	position: absolute;
	margin-top: -1.4375rem;
	margin-left: -0.0625rem;
}
.discover-menu > li:nth-child(1)::after, .discover-menu > li:nth-child(8)::after {
	content: '';
	width: 0;
}
.discover-menu > li a {
	height: 1.75rem;
	padding: 0 0.625rem;
	display: inline-block;
	border-radius: 4px;
}
.discover-menu > li:hover a {
	background-color: #FFE300;
}
.choice {
	padding: 0 1.875rem;
}
.choice a {
	display: block;
	float: left;
	margin-top: -0.125rem;
	margin-right: 2.5rem;
}
.choice a::after {
	content: '\e504';
	font-family: 'iconfont';
	display: block;
	font-weight: 550;
	float: right;
	font-size: 0.75rem;
}
.choice a:hover {
	color: #D36F16;
}
.navbar > ul > li > .second {
	position: absolute;
	width: 9.5rem;
	padding: 0.375rem 0;
	border-radius: 0 0 4px 4px;
	margin-left: -1.5rem;
	box-shadow: 0 1px 12px 0 rgba(0,0,0,.2);
	background-color: #FFFFFF;
}
.second .second-menu {
	width: 100%;
	height: 100%;
}
.second .second-menu li {
	height: 2.75rem;
	line-height: 2.75rem;
	padding-left: 1.25rem;
	text-align: left;
}
.second .second-menu li:hover {
	background-color: #FFE300;
}
.navbar > ul > li > .discover .choice {
	width: 100%;
	height: 3.1875rem;
}
.navbar > ul > li > .discover li {
	float: left;
}
.slider {
	width: 15.75rem;
	height: 100%;
	display: inline-block;
	margin-left: 1.78125rem;
}
.search {
	width: 3.75rem;
	height: 3.5rem;
	float: left;
	cursor: pointer;
	text-align: center;
	line-height: 3.5rem;
}
.search span {
	font-size: 1.5rem;
}
.search:hover {
	background-color: #282828;
	color: #FFE300;
}
.search:hover .exit {
	color: #282828;
}
.search:hover .search-do {
	color: #282828;
}
.search-info {
	width: 34.375rem;
	left: calc(50% - 16.875rem);
}
.search-input {
	position: absolute;
	width: 34.375rem;
	left: calc(50% - 16.875rem);
	display: none;
}
.search-input .exit {
	float: left;
	font-size: 2rem !important;
	width: 2.5rem;
	display: block;
	text-align: left;
	line-height: 3.5rem;
	cursor: pointer;
}
.search-input .exit .iconfont {
	font-size: 1.5rem !important;
}
.search-input .search-do {
	font-size: 1.5rem;
	width: 2.5rem;
	display: block;
	float: right;
	line-height: 3.5rem;
}
.search-input input {
	background-color: #FFE300;
	outline: none;
	border: none;
	height: 3.5rem;
	width: 29.375rem;
	line-height: 3.5rem;
	font-size: 1rem;
	float: left;
}
.search-more {
	position: relative;
	box-shadow: 0 1px 12px 0 rgba(0,0,0,.2);
	margin-top: 3.5rem;
	text-align: left;
	background-color: #FFFFFF;
}
.search-more li {
	height: 2.5rem;
	padding-left: 1.25rem;
	line-height: 2.5rem;
}
.search-more li:hover {
	background-color: #F2F2F2;
}
.search-more li:nth-child(1) {
	height: 2.5rem;
	line-height: 2.5rem;
	padding-left: 1.25rem;
	font-size: 0.75rem;
	color: #BBBBBB;
}
.search-more li:nth-child(1):hover {
	background-color: #FFFFFF;
}
.loginbar {
	height: 3.5rem;
	float: left;
	line-height: 3.5rem;
}
.loginbar > div {
	float: left;
}
.upload {
	width: 3.75rem;
	height: 3.5rem;
	cursor: pointer;
	text-align: center;
	line-height: 3.5rem;
}
.upload::after {
	content: '\e797';
	font-family: 'iconfont';
	font-size: 1.5rem;
}

.upload:hover {
	background-color: #282828;
	color: #FFE300;
}
.login {
	margin-left: 1rem;
}
.login, .regsiter {
	margin-top: 0.125rem;
}
.login::after {
	content: '';
	width: 0.0625rem;
	height: 0.625rem;
	display: block;
	float: right;
	background-color: #444444;
	margin: 0 1.25rem;
	margin-top: 1.4375rem;
}
/* END HEADER */

/* MAIN */
.main {
	width: 100%;
	position: relative;
}
.top0 {
	/* position: -webkit-sticky; */
	position: sticky;
	top: 0rem;
	z-index: 999;
}
.top {
	padding-top: 1rem;
	height: 3.5rem;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #FFFFFF;
	position: relative;
}
.top ul li {
	float: left;
	height: 3.5rem;
	line-height: 3.5rem;
	font-size: 1rem;
	text-align: center;
	padding: 0 2.03125rem;
	box-sizing: border-box;
}
.top ul li a {
	display: inline-block;
	height: 3.5rem;
	width: 4rem;
	border-bottom: 0.125rem #000000 solid;
	box-sizing: border-box;
}
.top ul li:nth-child(2) a {
	color: #999999;
	border: none;
}
.top ul li:nth-child(2):hover a {
	color: #282828;
	border-bottom: 2px #000000 solid;
}
.main-content {
	width: 100%;
	overflow: hidden;
	border-top: 0.125rem solid #eee;
	background-color: #F4F4F4;
	padding: 1.25rem 0;
	box-sizing: border-box;
}
/* CARD */

.card-mark-tip {
    width: 68px;
    height: 24px;
    border-radius: 4px 0 4px 0;
    background-color: rgba(0, 0, 0, .5);
    color: #FFFFFF;
    line-height: 24px;
    text-align: center;
    display: block;
    position: absolute;
    font-size: 12px;
    top: 0;
    left: 0;
    z-index: 99;
}

.main-card {
	overflow: hidden;
	margin: 0 auto;
	width: 70.625rem;
}
.card {
	width: 13.125rem;
	height: 19.25rem;
	background-color: #FFFFFF;
	border-radius: 4px;
	float: left;
	margin: 0 1.25rem 1.25rem 0;
}
.card:nth-of-type(5n + 5) {
	margin-right: 0;
}
.card-img {
	height: 9.875rem;
	position: relative;
	cursor: pointer;
}
.card-img img {
	width: 100%;
	height: 9.875rem;
	border-radius: 4px 4px 0 0;
}
.card-img::after {
	content: '';
	width: 100%;
	height: 9.875rem;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	background-color: #FFFFFF30;
	opacity: 0;
}
.card-img:hover::after {
	opacity: 1;
}
.card-info {
	height: 6.25rem;
	padding: 0.6875rem 1rem 0.8125rem;
	box-sizing: border-box;
	border-bottom: 1px #EEEEEE solid;
}
.title{
	font-size: 0.875rem;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	color: #282828;
	line-height: 1.25rem;
}
.title:hover {
	color: #D36F16;
	cursor: pointer;
}
.sub-title {
	font-size: 0.75rem;
	color: #BBBBBB;
	margin-bottom: 0.8125rem;
	line-height: 1.25rem;
}
.card-active  {
	height: 1.125rem;
}
.card-active .iconfont {
	font-size: 0.75rem !important;
	color: #BBBBBB;
	cursor: pointer;
}
.card-active span:nth-child(1) {
	margin-right: 0.625rem;
}
.card-active span:nth-child(2) {
	margin-right: 0.3125rem;
}
.card-active span:nth-child(3) {
	margin-right: 0.625rem;
}
.card-author {
	height: 3.125rem;
	line-height: 3.125rem;
	padding: 0 1rem;
	box-sizing: border-box;
}
.author-img {
	width: 1.5rem;
	height: 1.5rem;
	border-radius: 50%;
	vertical-align: middle;
	margin-right: 0.1875rem;
}
.card-author a:hover .author-wrap{
	display: block;
}
.author-wrap {
	position: absolute;
	display: none;
}
.author-more {
	width: 20rem;
	padding: 1.25rem;
	height: 9.75rem;
	background-color: #FFFFFF;
	position: relative;
	z-index: 999;
	box-shadow: 0 2px 6px 0 rgba(0,0,0,.15);
	border-radius: 4px;
	margin-left: -1rem;
	margin-top: -0.0625rem;
}
.author-more::before {
	content: '';
	border: 0.5rem solid;
	border-color: transparent transparent #FFFFFF;
	position: absolute;
	top: -1rem;
	left: 1.125rem;
	z-index: 999;
}
.author-more::after {
	content: '';
	border: 0.5625rem solid;
	border-color: transparent transparent rgba(0, 0, 0, .15);
	position: absolute;
	top: -1.125rem;
	left: 1.0625rem;
	z-index: -1;
}
.author-top {
	height: 2.5rem;
	position: relative;
}
.author-top img {
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 50%;
}
.author-top-name {
	font-size: 0.875rem;
	color: #282828;
	line-height: 0.875rem;
	position: absolute;
	top: 0.25rem;
	left: 3.125rem;
}
.author-top-name:hover {
	color: #D36F16;
	cursor: pointer;
}
.author-top-job {
	font-size: 0.75rem;
	color: #999999;
	line-height: 0.75rem;
	position: absolute;
	top: 1.25rem;
	left: 3.125rem;
}
.author-top-active {
	position: absolute;
	width: 4.375rem;
	height: 1.875rem;
	background-color: #FFE300;
	text-align: center;
	line-height: 1.875rem;
	color: #444;
	border: 1px solid #ffe300;
	border-radius: 4px;
	cursor: pointer;
	right: 0;
	top: 0.3125rem;
}
.author-middle {
	margin-top: 0.625rem;
	height: 4.6875rem;
	font-size: 0;
}
.author-middle img {
	width: 6.25rem;
	height: 4.6875rem;
	border-radius: 4px;
	margin-right: 0.625rem;
}
.author-middle img:last-child {
	margin-right: 0;
}
.author-bottom {
	margin-top: 0.625rem;
	color: #BBBBBB;
	height: 1.3125rem;
	line-height: 1.3125rem;
}
.author-bottom span {
	margin-right: 0.625rem;
	font-size: 0.75rem;
}
.card-name {
	font-size: 0.75rem;
}
.card-time {
	font-size: 0.75rem;
	color: #BBBBBB;
	float: right;
}
/* END CARD */

/* CONTENT-LIST */
.content-list {
	width: 100%;
	height: 2.5rem;
	margin: 1.25rem auto;
	overflow: hidden;
	display: flex;
	justify-content: center;
}
.content-list li {
	width: 2.5rem;
	height: 2.5rem;
	float: left;
	text-align: center;
	line-height: 2.5rem;
	border-radius: 4px;
	font-size: 0.875rem;
	color: #333333;
	margin: 0 0.1875rem;
	border: 1px solid #E9E9E9;
	background-color: #FFFFFF;
	box-sizing: border-box;
}
.content-list li:first-child {
	background-color: #FFE300;
}
.content-list li:nth-child(8):hover {
	background-color: #FFFFFF;
	cursor: text;
}
.content-list li:hover {
	background-color: #FFE300;
	cursor: pointer;
}
/* END CONTENT-LIST */

/* ADIMG */
.ad-img {
	margin-top: 2.5rem;
	width: 100%;
	
}
.ad-img img {
	width: 70.625rem;
	height: 6.25rem;
	border-radius: 4px;
	display: block;
	margin: 0 auto;
}
/* END ADIMG */

/* ADCOURSE */
.ad-course {
	width: 100%;
	margin-top: 1rem;
	font-size: 0.875rem;
	color: #666666;
	margin-bottom: 1.25rem;
}
.ad-course-wrap {
	width: 70.625rem;
	margin: 0 auto;
}
.ad-course .ad-course-title {
	margin: 0 0 1.25rem 0;
}
.ad-course span:nth-child(2) {
	cursor: pointer;
	float: right;
	color: #D36F16;
}
.ad-course ul li{
	float: left;
	margin-right: 1.25rem;
	position: relative;
	background-color: #FFFFFF;
}
.ad-course ul li:last-child {
	margin-right: 0;
}
.ad-course ul .mask {
	width: 13.125rem;
	height: 7.375rem;
	border-radius: 4px 4px 0 0;
}
.ad-course ul li .mask::before {
	content: '';
	width: 13.125rem;
	height: 7.375rem;
	background-color: #FFFFFF30;
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}
.ad-course ul .mask img {
	width: 13.125rem;
	height: 7.375rem;
	border-radius: 4px 4px 0 0;
}
.ad-course ul .mask:hover::before {
	display: block;
	cursor: pointer;
}
.ad-course ul li p {
	display: block;
	height: 2.5rem;
	margin-top: -0.25rem;
	background-color: #FFFFFF;
	padding: 0 0.625rem;
	line-height: 2.5rem;
	color: #000000;
	border-radius: 0 0 0.25rem 0.25rem;
	cursor: pointer;
}
.ad-course ul li p:hover {
	color: #D36F16;
}

/* END ADCOURSE */
/* END MAIN */

/* FOOTER */
footer {
	width: 100%;
	height: 14.3125rem;
	background-color: #282828;
	
}
.wrap-top {
	height: 8.125rem;
	width: 70.625rem;
	margin: 0 auto;
	line-height: 8.1875rem;
	border-bottom: 1px solid #333333;
}
.wrap-top a {
	color: #666666;
	font-size: 0.875rem;
}
.wrap-top a:hover {
	color: #999999;
}
.wrap-top ul li{
	float: left;		
	margin-right: 1.5rem;
	position: relative;
}
.wrap-top ul .iconfont:nth-child(11) {
	margin-left: 14.375rem;
}
.wrap-top ul .iconfont:nth-child(11) a {
	font-size: 1.25rem;
}
.wrap-top ul .iconfont:nth-child(12) a {
	font-size: 1.25rem;
}
.wrap-top ul li:nth-child(11)::before {
	content: '';
	display: block;
	background: url(../images/weixinma.jpg);
	background-size: 6.875rem 6.875rem;
	height: 6.875rem;
	width: 6.875rem;
	top: -4.0625rem;
	left: -3rem;
	border-radius: 4px;
	position: absolute;
	opacity: 0;
}
.wrap-top ul li:nth-child(11) a::before {
	content: '';
	display: block;
	position: absolute;
	border: 0.5625rem solid;
	border-color: transparent transparent rgba(255, 255, 255);
	transform: rotateX(180deg);
	top: 2.8125rem;
	opacity: 0;
}
.wrap-top ul li:nth-child(11):hover a {
	color: #58BC46;
}
.wrap-top ul li:nth-child(11):hover::before {
	opacity: 1;
}
.wrap-top ul li:nth-child(11):hover a::before {
	opacity: 1;
}
.wrap-top ul li:nth-child(12):hover a {
	color: #E90E24;
}
.wrap-middle {
	width: 70.625rem;
	margin: 1.25rem auto 0 auto;
	overflow: hidden;
}
.wrap-middle a {
	color: #666666;
	font-size: 0.75rem;
}
.wrap-middle a:hover {
	text-decoration: underline;
	text-decoration-color: #999999;	
	color: #999999;
}
.wrap-middle ul li {
	float: left;
}
.wrap-middle ul li img {
	vertical-align: middle;
}
.wrap-middle ul li::after {
	content: '';
	width: 0.0625rem;
	height: 0.75rem;
	margin: 0 1.25rem;
	display: inline-block;
	background-color: #666666;
}
.wrap-middle ul li:last-child::after {
	width: 0;
}
.wrap-bottom {
	width: 70.625rem;
	margin: 0.625rem auto 0 auto;
	overflow: hidden;
}
.wrap-bottom ul li {
	color: #666666;
	font-size: 0.75rem;
	float: left;
}
.wrap-bottom ul li a {
	color: #666666;
	font-size: 0.75rem;
}
.wrap-bottom a:hover {
	text-decoration: underline;
	text-decoration-color: #999999;	
	color: #999999;
}
.wrap-bottom ul li::after {
	content: '';
	width: 0.0625rem;
	height: 0.75rem;
	margin: 0 1.25rem;
	display: inline-block;
	background-color: #666666;
}
.wrap-bottom ul li:last-child::after {
	width: 0;
}
/* END FOOTER */